<template>
	<view>
		<my-main title="产品详情" :padding="0" :radius="0" background="#fff" isBack isNotDep :close="close">
			<up-swiper :list="good?.productImageGroup" indicator indicatorMode="line" circular height="750rpx"></up-swiper>
			<my-cell title="" isBox :padding="32">
				<view class="f-36 fwb">
					{{ good?.ProdName || '' }}
				</view>
				<view class="f-28 m-t-16 text-color-text">
					<text>{{ `类型：${prodTypeName(good.ProdType)}` }}</text>
					<text class="m-l-32">{{ `类型：${good?.ProdCode}` }}</text>
				</view>
			</my-cell>
			<my-cell title="产品参数" isBox :padding="32">
				<template v-if="['2', '3'].includes(good.ProdType)">
					<my-text label="装订方式" align="left" isRequired direction="top">
						<GoodSelect :options="good.Binds" labelName="Field" valueName="Code" @change="inquiryChange"></GoodSelect>
					</my-text>
					<my-text label="装订方向" align="left" isRequired direction="top">
						<GoodSelect :options="good.Directions" labelName="Field" valueName="Code" @change="inquiryChange"></GoodSelect>
					</my-text>
				</template>
				<my-text label="成品尺寸" align="left" isRequired direction="top">
					<GoodSelect :options="good.Sizes" labelName="Field" valueName="Field" @change="inquiryChange"></GoodSelect>
				</my-text>
				<my-text label="产品数量" align="left" direction="top">
					<view class="flex-start-center">
						<up-number-box v-model="inquiry.Copys" decimal-length="0" min="1" :step="good.IncreaseNum || 1"></up-number-box>
						<text class="m-l-32">{{ `最小递增数 ${good.IncreaseNum} ${good.UnitName || '本'}` }}</text>
					</view>
				</my-text>
			</my-cell>
			<template :key="index" v-for="(item, index) in good?.parts || []">
				<my-cell :title="item.PartNickName" isBox :padding="32">
					<my-text label="颜色" align="left" isRequired direction="top">
						<GoodSelect :options="item.Colors" labelName="Field" valueName="Code" @change="inquiryChange"></GoodSelect>
					</my-text>
					<my-text label="单双面" align="left" isRequired direction="top">
						<GoodSelect :options="item.SigOrDbls" labelName="Field" valueName="Code" @change="inquiryChange"></GoodSelect>
					</my-text>
					<my-text label="纸张" align="left" isRequired direction="top" :margin="0">
						<my-text
							:label="`${row.Field}`"
							align="left"
							direction="top"
							:titleSize="22"
							titleColor="#333"
							:key="rowIndex"
							v-for="(row, rowIndex) in item.Papers"
						>
							<GoodSelect :options="row.children" labelName="Field" valueName="Code" @change="paperChange(item,row)"></GoodSelect>
						</my-text>
					</my-text>
					<my-text label="工艺" align="left" direction="top" :margin="0" v-if="item.PrtAfts.length > 0">
						<my-text
							:label="`${row.Field}`"
							align="left"
							direction="top"
							:titleSize="22"
							titleColor="#333"
							:isRequired="row.IsMust"
							:key="rowIndex"
							v-for="(row, rowIndex) in item.PrtAfts"
						>
							<GoodSelect :options="row.children" labelName="Field" valueName="Code" :isRequired="row.IsMust" @change="inquiryChange"></GoodSelect>
						</my-text>
					</my-text>
				</my-cell>
			</template>
			<template #footer>
				<view class="flex-start-center m-16">
					<view class="flexAuto">
						<text class="f-28">￥</text>
						<text class="f-36">{{prices?.find((el:any)=>el.Check)?.TotalPrice || '0.00'}}</text>
					</view>
					<view class="w-300">
						<my-button>确认</my-button>
					</view>
				</view>
			</template>
		</my-main>
	</view>
</template>

<script lang="uts" setup>
//公共状态
import GoodSelect from './GoodSelect.vue'
import { useVue  } from '@/utils/useVue.uts'
const { reactive, ref,app,Token,onMounted,watch,http,goToPage,getPrevPageQuery,useAttrs,arrFlatten } = useVue()
interface Props {
	ProdCode?:string
	ClientCode?:string
}
const props = withDefaults(defineProps<Props>(), {
})
// 所有未声明的属性都会进入 $attrs
const attrs = useAttrs()
// 合并所有属性（显式 props + attrs）
const allProps = {
  ...props,
  ...attrs
}
const labelWidth=ref(160)
// 产品数据
const good:any = ref({})
const prices:any = ref([])
// 询价数据
const inquiry:any = reactive({
	ClientCode: props.ClientCode, //客户编号
	ProdCode: props.ProdCode, //产品编号
	IsInquiry: "Y", //是否为询价
	OrderCode: "", //订单编号
	ProdType: "",//产品类型
	CoverClosed: false,//是否关闭封面
	PoCode: "",
	GoodCode: "",
	Copys: 1, //打印份数
	SizeName: "",//装订名称
	SizeLength: "", //成品长
	SizeWidth: "", //成品宽
	BindCode: "",//装订code
	BindOrient: "纵向",//装订方向
	SelTarget: "",//
	parts:[],
})
const formData:any = reactive({

})
const emit = defineEmits(['click','close'])
const paperChange=(part:any,paper:any)=>{
	part.Papers.forEach((el:any)=>{
		if(el.Code!==paper.Code){
			el.IsDefault=false
			el.children=el.children.map((child)=>({
				...child,
				IsDefault:false,
			}))
		}else{
			el.IsDefault=true
		}
	})
	inquiryChange()
}
const inquiryChange=()=>{
	const goodRow=good.value
	//产品类型
	inquiry.ProdType=goodRow.ProdType
	//装订方式
	const bindRow=goodRow.Binds?.find((el:any)=>el.IsDefault) || {}
	inquiry.BindCode=bindRow.Code
}
const click=(row:any)=>{
	emit('click')
}
const changeSize=(row:any)=>{
	let _row:any={}
	if(Array.isArray(row)){
		_row=row[0]
	}else{
		_row=row
	}
	inquiry.SizeName=_row.Field
	inquiry.SizeLength=_row.Length
	inquiry.SizeWidth=_row.Width
}
const close=()=>{
	emit('close')
}
const prodTypeName=(type:string)=>{
	const prodType={
		'1':'单页产品',
		'2':'书本产品',
		'3':'无封面书本产品',
		'4':'非印刷品',
	}
	return prodType[type] || '未知'
}
const arrDefault=(arr:any)=>{
	if(arr?.length>0){
		const isDefault=arr.some((el:any)=>el.IsDefault)
		if(!isDefault){
			arr[0].IsDefault=true
		}
	}
}
//搜索
const getTbody = () => {
	if(!props.ProdCode) return
	http.request({
		url: 'api/ProdMan/GetProdAllInfo',
		data: {
			ProdCode:props.ProdCode,
		},
		success: (res : any) => {
			//初始化数据
			arrDefault(res.Binds)
			arrDefault(res.Sizes)
			arrDefault(res.Directions)
			//工艺设置
			const CoverPart={
				...res.CoverPart,
				IsCoverPart:"Y",
				SubPageType:'',
				PartNickName:'封面',
			}
			const InnerPartList=res.InnerPartList.map((el:any)=>({
				...el,
				SubPageType:el.SubPageType || '1',
				IsCoverPart:"N",
				PartNickName:el.PartNickName || '内页',
			}))
			let parts=[]
			if(res.ProdType==='2'){
				parts=[CoverPart,...InnerPartList]
			}else{
				parts=InnerPartList
			}
			good.value={
				...res,
				productImageGroup:[res.ImgUrl],//产品图片
				parts:parts.map((el:any)=>{
					arrDefault(el.Colors)//颜色
					arrDefault(el.SigOrDbls)//单双面
					if(el.Papers.length>0){
						let defaultIndex=0
						el.Papers.forEach((item:any)=>{
							if(item.children.some((child)=>child.IsDefault)){
								defaultIndex++
							}
						})
						if(defaultIndex===0){
							el.Papers[0].children[0].IsDefault=true
						}
					}
					if(el.PrtAfts.length>0){
						el.PrtAfts.forEach((item:any)=>{
							if(item.IsMust){
								arrDefault(item.children)//单双面
							}
						})
					}
					return el
				})
			}
			//开始询价
			inquiryChange()
		},
		fail:()=>{
		}
	})
}
onMounted(() => {
	getTbody()
})
</script>

<style scoped lang="scss"></style>
